<template>
	<view class="activedetail">

		<view class="activedetail_center">
			<view class="title" v-if="!title">
				【{{contentobj.title}}】
			</view>
			<view class="timeline">
				<image src="https://luying.hacuu.com/static/Frame@2x(27).png" mode=""></image>
				<span>{{timestampfun(contentobj.createtime*1000)}}</span>
			</view>
			<up-parse :content="content"></up-parse>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		onShow,
		onLoad,
		onPageScroll
	} from "@dcloudio/uni-app";
	import {
		noticefile,
		article,
		activityfile1
	} from '@/api/home.js'
	const title = ref('')
	const contentobj = ref({})
	onLoad((opt) => {
		title.value = opt.title
		if (opt.title == '详情') {
			uni.setNavigationBarTitle({
				title: "详情" //导航栏名称，同时可使用三元表达式等动态设置
			});
		} else if (opt.title == '售后保障') {
			uni.setNavigationBarTitle({
				title: "售后保障" //导航栏名称，同时可使用三元表达式等动态设置
			});
			init(4)
			return
		} else if (opt.title == '预约须知') {
			uni.setNavigationBarTitle({
				title: "预约须知" //导航栏名称，同时可使用三元表达式等动态设置
			});
			init(5)
			return
		} else if (opt.title == '时间规定') {
			uni.setNavigationBarTitle({
				title: "时间规定" //导航栏名称，同时可使用三元表达式等动态设置
			});
			init(6)
			return
		} else if (opt.title == '其他须知') {
			uni.setNavigationBarTitle({
				title: "其他须知" //导航栏名称，同时可使用三元表达式等动态设置
			});
			init(7)
			return
		} else if (opt.title == '租赁协议') {

			init(8)
			return
		} else {
			initdetail1(opt.id)
			return
		}
		initdetail(opt.id)
	})
	async function initdetail1(id) {
		const res = await activityfile1({
			id
		})
		if (res.data.code == 1) {
			content.value = res.data.data.content
			contentobj.value = res.data.data
			console.log(contentobj.value, 'contentobj.valuecontentobj.value');
		}
	}
	async function initdetail(id) {
		const res = await noticefile({
			id
		})
		if (res.data.code == 1) {
			content.value = res.data.data.content
		}
	}
	async function init(num) {
		const res = await article({
			'id': num
		})
		if (res.data.code == 1) {
			content.value = res.data.data.content
			contentobj.value = res.data.data
			uni.setNavigationBarTitle({
				title: contentobj.value['title'] //导航栏名称，同时可使用三元表达式等动态设置
			});
			console.log(contentobj.value, 'contentobj.valuecontentobj.valuecontentobj.value');
		}
	}

	function timestampfun(time) {
		const date = new Date(time);
		const year = date.getFullYear();
		const month = String(date.getMonth() + 1).padStart(2, "0");
		const day = String(date.getDate()).padStart(2, "0");
		const hours = String(date.getHours()).padStart(2, "0");
		const minutes = String(date.getMinutes()).padStart(2, "0");
		const seconds = String(date.getSeconds()).padStart(2, "0");
		const formattedDate = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
		return formattedDate
	}
	// 创建响应式数据  
	const content = ref(`  
		<p>这是详情内容1231231231</p>  
		
	`);
</script>

<style lang="scss">
	.activedetail {
		overflow: hidden;
		width: 100%;

		&_center {
			width: 686rpx;
			margin: auto;
			display: flex;
			flex-direction: column;
			align-items: center;

			.title {
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 32rpx;
				color: #1D2129;
				width: 100%;
				text-align: center;
				margin-top: 32rpx;
			}

			.timeline {
				display: flex;
				align-items: center;
				margin-top: 18rpx;
				margin-bottom: 32rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #8D8D8D;

				image {
					width: 29rpx;
					height: 29rpx;
					border-radius: 50%;
					margin-right: 14rpx;
				}

			}
		}
	}
</style>